<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,user-scalable=0">
		<meta-equiv="Pragma"content="no-cache">
		<meta-equiv="Cache-Control"content="no-cache">
		<meta-equiv="Expires"content="0">
		<title>岭南英雄传招募</title>
		<link rel="stylesheet" href="{$_C.hy_path}css/hero/idnex.css" />
		<link rel="stylesheet" href="{$_C.hy_path}css/myanimate.css" />
	</head>
	<body>
		<div class="bgtile">
			<img src="http://g4cdn.airefp.com{$_C.hy_path}images/hero/titlegif.gif">
			<img src="http://g4cdn.airefp.com{$_C.hy_path}images/hero/1_02.jpg">
			<img src="http://g4cdn.airefp.com{$_C.hy_path}images/hero/1_03.jpg">
			<img src="http://g4cdn.airefp.com{$_C.hy_path}images/hero/1_04.jpg">
		</div>
		<div class="tilexiao animated fadeInDown"><img src="http://g4cdn.airefp.com{$_C.hy_path}images/hero/tilexiao.png"></div>
		<div class="jian"><img src="{$_C.hy_path}images/hero/jian.png"></div>
		<form>
		<div class="texbox">
			<input type="text" id="name" name='name' placeholder="姓名:"/>
			<input type="text" id="sex" name="sex" placeholder="性别:"/>
			<input type="text" id="age" name="age" placeholder="年龄:"/>
			<input type="text" id="phone" name="phone" placeholder="电话:"/>
			<textarea id="specialty" name="specialty" placeholder="武术特长:（120字以内）"></textarea>
			<textarea id="experience" name="experience" placeholder="演艺经历:（120字以内）"></textarea>
			<div class="tp">点击上传照片:</div>
			<div class="phoh">
				<div class="tianjiazhaopian upload-empty"><span></span></div>
			</div>
			<input id="but" onClick="apply()" type="button" value="点击提交信息" />
		</div>
		</form>
		<audio id="musicfx" loop autoplay>
            <source src="http://g4cdn.airefp.com{$_C.hy_path}images/hero/s_C32kbps.mp3" type="audio/mpeg">
        </audio>
        <script type="text/javascript" src="{$_C.hy_path}js/jquery-1.10.2.min.js" ></script>
        <script src="http://g4cdn.airefp.com{$_C.hy_path}js/yf.js"></script>
        <script type="text/javascript" src="{$_C.hy_path}js/hero/index.js" ></script>
        <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
        <script>
		  wx.config({
		    debug: false, 
		   appId: '{$jsdk.appId}',
				timestamp: {$jsdk.timestamp},
				nonceStr: '{$jsdk.nonceStr}',
				signature: '{$jsdk.signature}',
		    jsApiList: [
		      // 所有要调用的 API 都要加到这个列表中
			  'chooseImage',
				'previewImage',
				'uploadImage',
				'downloadImage',
		      'onMenuShareTimeline',
		      'onMenuShareAppMessage',
		    
		    ]
		  });
		
		  wx.ready(function () {
 			wx.onMenuShareTimeline({
			    title: '岭南英雄传剧组招募新演员啦～',
			     link:'http://g4.airefp.com/ws/index.php?g=mobile&m=hero&a=index',
			     imgUrl: 'http://g4.airefp.com/ws/Mobile/Webroot/gf/images/hero/share-info.png',
			      trigger: function (res) {
			       
			      },
			      success: function (res) {
			    	 
			      },
			      cancel: function (res) {
			       
			      },
			      fail: function (res) {
			      }
		    });
		    
			wx.onMenuShareAppMessage({
			    link:'http://g4.airefp.com/ws/index.php?g=mobile&m=hero&a=index',
			     title: '招募新演员',
			    desc: '岭南英雄传剧组招募新演员啦～',
			  	imgUrl: 'http://g4.airefp.com/ws/Mobile/Webroot/gf/images/hero/share-info.png',
			    success: function () { 
			    	
			    },
			    cancel: function () { 
			        // 用户取消分享后执行的回调函数
			    }
		});

  });
		  var add_img = $(".upload-empty");
			var num = 0;
			var limit_num = 4;
			var images = {
				    localId: [],
				    serverId: []
				  };
				$('.phoh').click(function(){
					if(num>=limit_num)
					{
						warn("至多可上传4张图片");
						return;
					}
					wx.chooseImage({
						count: 4,
						success: function (res) {
							images.localId = res.localIds;
					        if (res.localIds.length == 0) {
					  	      	warn('请先选择图片');
								return;
					  	    }
					        var i = 0; 
					        var length = images.localId.length;
					        images.serverId = [];
					        function upload() 
					        {
					        	if(num>=limit_num-1)
								{
									add_img.fadeOut("fast");
										
								}
					        	
								var img;
					        	wx.uploadImage({
					        		localId: images.localId[i],
					      		    success: function (res) {
					      		    	i++;
					      		    	num++;
					      		    	images.serverId.push(res.serverId);
					      		    	img = res.serverId;
					      		    	add_img_div(images.localId[i-1],img);
					      		    	if(num>=limit_num)
										{
											return;
										}
					      		    	if(i<length)
					      		    	{
					      		    		upload();
					      		    	}
					      		    }
					        	});
					        }
					        upload();
					    }
				});
			});
				
				function add_img_div(limg,simg)
				{
					add_img.before(function(){
						return '<input type="hidden" name="media" value="'+simg+'" /><div class="tianjiazhaopian" ><span style="background-image:url('+limg+')"></span></div>';
					});
				
				    	
				}

		</script>
	</body>
</html>